<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="姓名" prop="zjName">
        <el-input v-model="queryParams.zjName" placeholder="请输入姓名" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="手机号" prop="zjSj">
        <el-input v-model="queryParams.zjSj" placeholder="请输入手机号" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="政治面貌" prop="zzmm">
        <el-select v-model="queryParams.zzmm" placeholder="请选择政治面貌">
          <el-option v-for="item in zzmmOption" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="职称" prop="zc">
        <el-select v-model="queryParams.zc" placeholder="请选择职称">
          <el-option v-for="item in zcOption" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="所学专业" prop="sxzy">
        <el-input v-model="queryParams.sxzy" placeholder="请输入所学专业" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="学历" prop="xl">
        <el-select v-model="queryParams.xl" placeholder="请选择学历">
          <el-option v-for="item in xueliOption" :key="item.xlvalue" :label="item.label" :value="item.xlvalue">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="专家类型" prop="zjlx">
        <el-select v-model="queryParams.zjlx" placeholder="请选择专家类型">
          <el-option v-for="item in zjlxOption" :key="item.zjlxvalue" :label="item.label" :value="item.zjlxvalue">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="专长领域" prop="zcly">
        <el-input v-model="queryParams.zcly" placeholder="请输入专长领域" clearable @keyup.enter.native="handleQuery" />

      </el-form-item>





      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
          v-hasPermi="['system:zhuanjiabiao:add']">新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
          v-hasPermi="['system:zhuanjiabiao:export']">导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="zhuanjiabiaoList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="照片" align="center" prop="image" width="100">
        <template slot-scope="scope">
          <image-preview :src="scope.row.image" :width="50" :height="50" />
        </template>
      </el-table-column>
      <el-table-column label="姓名" align="center" width="100px" prop="zjName" />
      <el-table-column label="性别" align="center" prop="sex" width="50px">
        <template slot-scope="scope">
          {{ xbOption[scope.row.sex].label }}
        </template>
      </el-table-column>
      <!-- <el-table-column label="政治面貌" align="center" prop="zzmm">
        <template slot-scope="scope">
          {{ zzmmOption[scope.row.zzmm].label }}
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="民族" align="center" prop="mz" /> -->
      <el-table-column label="手机号" align="center" prop="sj" width="120px" />
      <!-- <el-table-column label="电话" align="center" prop="dh" width="120px" /> -->
      <el-table-column label="专长领域" align="center" prop="zcly" />
      <!-- <el-table-column label="职称" align="center" prop="zc">
      <template slot-scope="scope">
        {{ zcOption[scope.row.zc].label }}
      </template>
      </el-table-column> -->
      <!-- <el-table-column label="毕业院校" align="center" prop="byyx" /> -->
      <el-table-column label="学历" align="center" prop="xl">
        <template slot-scope="scope">
          {{ xueliOption[scope.row.xl].label }}
        </template>
      </el-table-column>
      <el-table-column label="专家类型" align="center" prop="zjlx">
        <template slot-scope="scope">
          {{ zjlxOption[scope.row.zjlx].label }}
        </template>
      </el-table-column>
      <el-table-column label="推荐单位" align="center" prop="tjdw" />
      <el-table-column label="所在单位" align="center" prop="szdw" />
      <!-- <el-table-column label="职位" align="center" prop="zw" /> -->
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
            v-hasPermi="['system:zhuanjiabiao:edit']">修改</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
            v-hasPermi="['system:zhuanjiabiao:remove']">删除</el-button>
          <el-button @click="xqhandleClick(scope.row)" type="text" size="small">详情页</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />

    <!-- 添加或修改专家管理对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" :inline="true" label-width="80px">
        <el-form-item label="姓名" prop="zjName">
          <el-input v-model="form.zjName" placeholder="请输入姓名" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <el-select v-model="form.sex" placeholder="性别" style="width: 200px;">
            <el-option v-for="item in xbOption" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="生日" prop="birthday">
          <el-date-picker clearable v-model="form.birthday" type="date" style="width: 200px;" value-format="yyyy-MM-dd"
            placeholder="请选择生日">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="政治面貌" prop="zzmm">
          <el-select v-model="form.zzmm" placeholder="请选择职称" style="width: 200px;">
            <el-option v-for="item in zzmmOption" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="民族" prop="mz">
          <el-input v-model="form.mz" style="width: 200px;" placeholder="请输入民族" />
        </el-form-item>
        <el-form-item label="手机" prop="sj">
          <el-input v-model="form.sj" placeholder="请输入手机" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="电话" prop="dh">
          <el-input v-model="form.dh" placeholder="请输入电话" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="身份证号" prop="sfzh">
          <el-input v-model="form.sfzh" placeholder="请输入身份证号" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="电子邮箱" prop="dzyx">
          <el-input v-model="form.dzyx" placeholder="请输入电子邮箱" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="学历" prop="xl">
          <el-select v-model="form.xl" style="width: 200px;" placeholder="请选择学历">
            <el-option v-for="item in xueliOption" :key="item.xlvalue" :label="item.label" :value="item.xlvalue">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="职称" prop="zc">
          <el-select v-model="form.zc" placeholder="请选择职称" style="width: 200px;">
            <el-option v-for="item in zcOption" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="所学专业" prop="sxzy">
          <el-input v-model="form.sxzy" placeholder="请输入所学专业" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="毕业院校" prop="byyx">
          <el-input v-model="form.byyx" placeholder="请输入毕业院校" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="专家类型" prop="zjlx">
          <el-select v-model="form.zjlx" placeholder="请选择专家类型" style="width: 200px;">
            <el-option v-for="item in zjlxOption" :key="item.zjlxvalue" :label="item.label" :value="item.zjlxvalue">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="推荐单位" prop="tjdw">
          <el-select v-model="queryParams.tjdw" placeholder="推荐单位">
            <el-option v-for="item in deptOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="所在单位" prop="szdw">
          <el-input v-model="form.szdw" placeholder="请输入所在单位" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="职位" prop="zw">
          <el-input v-model="form.zw" placeholder="请输入职位" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="专长领域" prop="zcly">
          <el-input v-model="form.zcly" placeholder="请输入专长领域" style="width: 280px;" />
        </el-form-item>
        <el-form-item label="单位地址" prop="dwdz">
          <el-input v-model="form.dwdz" placeholder="请输入单位地址" style="width: 280px;" />
        </el-form-item>
        <el-form-item label="家庭地址" prop="jtdz">
          <el-input v-model="form.jtdz" placeholder="请输入家庭地址" style="width: 280px;" />
        </el-form-item>
        <br>
        <el-form-item label="成就" prop="cj" align="left">
          <editor v-model="form.cj" :min-height="192" style="width: 530px;" />
        </el-form-item>
        <el-form-item label="照片" prop="image">
          <image-upload v-model="form.image" align="left" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer" align="center">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 详情页 -->
    <el-dialog :title="title" :visible.sync="xqDialog" width="1200px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" :inline="true" label-width="80px" width="400px">
        <el-form-item label="姓名" prop="zjName">
          <el-input v-model="form.zjName" placeholder="请输入姓名" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <el-select v-model="form.sex" placeholder="性别" style="width: 200px;">
            <el-option v-for="item in xbOption" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="生日" prop="birthday">
          <el-date-picker clearable v-model="form.birthday" type="date" style="width: 200px;" value-format="yyyy-MM-dd"
            placeholder="请选择生日">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="政治面貌" prop="zzmm">
          <el-select v-model="form.zzmm" placeholder="请选择职称" style="width: 200px;">
            <el-option v-for="item in zzmmOption" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="民族" prop="mz">
          <el-input v-model="form.mz" style="width: 200px;" placeholder="请输入民族" />
        </el-form-item>
        <el-form-item label="身份证号" prop="sfzh">
          <el-input v-model="form.sfzh" placeholder="请输入身份证号" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="手机" prop="sj">
          <el-input v-model="form.sj" placeholder="请输入手机" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="电话" prop="dh">
          <el-input v-model="form.dh" placeholder="请输入电话" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="学历" prop="xl">
          <el-select v-model="form.xl" style="width: 200px;" placeholder="请选择学历">
            <el-option v-for="item in xueliOption" :key="item.xlvalue" :label="item.label" :value="item.xlvalue">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="电子邮箱" prop="dzyx">
          <el-input v-model="form.dzyx" placeholder="请输入电子邮箱" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="职称" prop="zc">
          <el-select v-model="form.zc" placeholder="请选择职称" style="width: 200px;">
            <el-option v-for="item in zcOption" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="所学专业" prop="sxzy">
          <el-input v-model="form.sxzy" placeholder="请输入所学专业" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="毕业院校" prop="byyx">
          <el-input v-model="form.byyx" placeholder="请输入毕业院校" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="专家类型" prop="zjlx">
          <el-select v-model="form.zjlx" placeholder="请选择专家类型" style="width: 200px;">
            <el-option v-for="item in zjlxOption" :key="item.zjlxvalue" :label="item.label" :value="item.zjlxvalue">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="专长领域" prop="zcly">
          <el-input v-model="form.zcly" placeholder="请输入专长领域" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="所在单位" prop="szdw">
          <el-input v-model="form.szdw" placeholder="请输入所在单位" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="职位" prop="zw">
          <el-input v-model="form.zw" placeholder="请输入职位" style="width: 200px;" />
        </el-form-item>
        <el-form-item label="单位地址" prop="dwdz">
          <el-input v-model="form.dwdz" placeholder="请输入单位地址" style="width: 280px;" />
        </el-form-item>
        <el-form-item label="家庭地址" prop="jtdz">
          <el-input v-model="form.jtdz" placeholder="请输入家庭地址" style="width: 280px;" />
        </el-form-item>
        <br>
        <el-form-item label="成就" prop="cj">
          <editor v-model="form.cj" :min-height="192" style="width: 530px;" />
        </el-form-item>
        <el-form-item lable="活动" align="center">
          <el-table v-loading="loading" :data="huodongs" height="200" border style="width: 530px;">
            <el-table-column label="参加过的活动" prop="hdName" align="center" />
          </el-table>
        </el-form-item>
        <el-form-item label="照片" prop="image">
          <image-upload v-model="form.image" align="left" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer" align="center">
        <el-button type="primary" @click="xqDialog = false">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listZhuanjiabiao, getZhuanjiabiao, delZhuanjiabiao, addZhuanjiabiao, updateZhuanjiabiao } from "@/api/system/zhuanjiabiao";
import { listHuodongbiao } from "@/api/system/huodongbiao";


import { deptTreeSelect } from "@/api/system/user";

import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
  dicts: ['sys_user_sex'],
  name: "Zhuanjiabiao",
  components: { Treeselect },
  data() {
    return {
      //详情显示
      xqDialog: false,
      dialogcjImageUrl: '',
      dialogcjVisible: false,
      fileList: [],
      huodongs: [],
      //存放推荐单位
      deptOptions: undefined,
      // 选择框数据
      xbOption: [{
        value: "0",
        label: "男"
      }, {
        value: "1",
        label: "女"
      }, {
        value: "2",
        label: "其他"
      }
      ],
      value: '',

      zcOption: [{
        value: '0',
        label: '初级职称'
      }, {
        value: '1',
        label: '中级职称'
      }, {
        value: '2',
        label: '高级职称'
      },
      ],
      value: '',

      zzmmOption: [{
        value: '0',
        label: '群众'
      }, {
        value: '1',
        label: '团员'
      }, {
        value: '2',
        label: '党员'
      }, {
        value: '3',
        label: '其他'
      }
      ],
      value: '',

      xueliOption: [{
        xlvalue: '0',
        label: '博士研究生'
      }, {
        xlvalue: '1',
        label: '硕士研究生'
      }, {
        xlvalue: '2',
        label: '本科毕业'
      }, {
        xlvalue: '3',
        label: '本科结业'
      }, {
        xlvalue: '4',
        label: '专科毕业生'
      }, {
        xlvalue: '5',
        label: '其他'
      }
      ],
      xlvalue: '',
      zjlxOption: [{
        zjlxvalue: '0',
        label: '分企业导师'
      }, {
        zjlxvalue: '1',
        label: '专家智库'
      }],
      zjlxvalue: '',

      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 专家管理表格数据
      zhuanjiabiaoList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        zjName: null,
        sex: null,
        birthday: null,
        zzmm: null,
        mz: null,
        zc: null,
        byyx: null,
        sxzy: null,
        xl: null,
        zjlx: null,
        image: null,
        tjdw: null,
        zcly: null,
        szdw: null,
        zw: null,
        dwdz: null,
        dh: null,
        sj: null,
        dzyx: null,
        sfzh: null,
        jtdz: null,
        cj: null,
        cjimage: null,
        hdName: null,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        zjName: [
          { required: true, message: "姓名不能为空", trigger: "blur" }
        ],
        sex: [
          { required: true, message: "性别不能为空", trigger: "change" }
        ],
        birthday: [
          { required: true, message: "生日不能为空", trigger: "blur" }
        ],
        zzmm: [
          { required: true, message: "政治面貌不能为空", trigger: "blur" }
        ],
        mz: [
          { required: true, message: "民族不能为空", trigger: "blur" }
        ],
        byyx: [
          { required: true, message: "毕业院校不能为空", trigger: "blur" }
        ],
        sxzy: [
          { required: true, message: "所学专业不能为空", trigger: "blur" }
        ],
        xl: [
          { required: true, message: "学历不能为空", trigger: "blur" }
        ],
        zjlx: [
          { required: true, message: "专家类型不能为空", trigger: "blur" }
        ],
        image: [
          { required: true, message: "照片不能为空", trigger: "blur" }
        ],
        zcly: [
          { required: true, message: "专长领域不能为空", trigger: "blur" }
        ],
        szdw: [
          { required: true, message: "所在单位不能为空", trigger: "blur" }
        ],
        zw: [
          { required: true, message: "职位不能为空", trigger: "blur" }
        ],
        dwdz: [
          { required: true, message: "单位地址不能为空", trigger: "blur" }
        ],
        dh: [
          { required: true, message: "电话不能为空", trigger: "blur" }
        ],
        sj: [
          { required: true, pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号", trigger: "blur" }
        ],
        dzyx: [
          { required: true, message: "电子邮箱不能为空", trigger: "blur" }
        ],
        sfzh: [
          { required: true, message: "身份证号不能为空", trigger: "blur" },
          {
            required: true, trigger: "blur", validator: (rule, value, callback) => {
              const reg = "(^[1-9]\\d{5}(18|19|20)\\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\\d{3}[0-9Xx]$)|" +
                "(^[1-9]\\d{5}\\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\\d{3}$)";
              if (value == "" || value == undefined || value == null) {
                callback();
              } else if (value.match(reg) == null) {
                callback(new Error('请输入正确的身份证号码'));
              } else {
                callback();
              }

            }
          },

        ],
        jtdz: [
          { required: true, message: "家庭地址不能为空", trigger: "blur" }
        ],
      }
    };
  },
  created() {
    this.getList();
    this.getDeptTree();

  },


  methods: {


    //
    /** 推荐单位 */
    getDeptTree() {
      deptTreeSelect().then(response => {
        this.deptOptions = response.data;

        let treeList = this.deptOptions;
        this.deptOptions = treeList[0].children[0].children;
        console.log(treeList[0].children[0].children);

      });
    },


    // 详情页
    xqhandleClick(row) {
      console.log(row);
      this.reset();
      const zjId = row.zjId || this.ids
      getZhuanjiabiao(zjId).then(response => {
        this.form = response.data;
        //获取该专家参加过的所有活动，根据专家名字进行查询
        // this.queryParams.sj = this.form.sj;
        this.queryParams.zj = this.form.zj_name;
        listHuodongbiao(this.queryParams).then(response => {
          this.huodongs = response.rows;
        });
        this.xqDialog = true;
        this.title = "专家详情";
      });
    },
    /** 查询专家管理列表 */
    getList() {
      this.loading = true;
      listZhuanjiabiao(this.queryParams).then(response => {
        this.zhuanjiabiaoList = response.rows;
        this.total = response.total;
        this.loading = false;
        var OldArrObject = response.rows;
        var NewArrObject = OldArrObject.map((item, index) => {
          return Object.assign({}, { 'zjName': item.zjName })
        })
        this.zjarr = NewArrObject;
        console.log(this.zjarr);
      });

    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        zjId: null,
        zjName: null,
        sex: null,
        birthday: null,
        zzmm: null,
        mz: null,
        zc: null,
        byyx: null,
        sxzy: null,
        xl: null,
        zjlx: null,
        image: null,
        tjdw: null,
        zcly: null,
        szdw: null,
        zw: null,
        dwdz: null,
        dh: null,
        sj: null,
        dzyx: null,
        sfzh: null,
        jtdz: null,
        cj: null
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;

    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.zjId)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加专家管理";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const zjId = row.zjId || this.ids
      getZhuanjiabiao(zjId).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改专家管理";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.zjId != null) {
            updateZhuanjiabiao(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addZhuanjiabiao(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const zjIds = row.zjId || this.ids;
      this.$modal.confirm('是否确认删除专家管理编号为"' + zjIds + '"的数据项？').then(function () {
        return delZhuanjiabiao(zjIds);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => { });
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('system/zhuanjiabiao/export', {
        ...this.queryParams
      }, `zhuanjiabiao_${new Date().getTime()}.xlsx`)
    }
  }
};
</script>
